<template>
  <div class="block">
    <el-carousel >
      <el-carousel-item v-for="ss in pics" :key = "ss.id">
        <a class="pics" :href="ss[0]">
          <img :src="ss[1]" alt="">
        </a>
      </el-carousel-item>
    </el-carousel>
  </div>

</template>
<script>
  export default {
    data(){
      return {
        pics:[]
      }
    },
    mounted:function () {
    this.over();
  },
  methods: {
    over: function () {
      var that = this;
      if(!sessionStorage.getItem('picskey')){
        axios.get('https://bird.ioliu.cn/v2/?url=http://101.37.161.89/wordpress/?post_type=jk_coursepic&p=4&json=1').then(re => {
          for (var i in re.data.post.custom_fields) {
            re.data.post.custom_fields[i] = re.data.post.custom_fields[i][0].split('=');
            that.pics.push(re.data.post.custom_fields[i]);
          }
          sessionStorage.setItem("picskey", JSON.stringify(that.pics));
          console.log(`网络请求`);
        })
      }else {
        var site = sessionStorage.getItem("picskey");
        this.pics = JSON.parse(site);
        console.log("这个是本地存储");
      }

    }
  }
  }
</script>
<style>

  .pics > img {
    width: 100%;
    height: 100%;
  }
  .el-carousel__container{
    height: 30vh!important;
  }
  @media only screen and (min-width:641px) {
    .el-carousel__container{
      height:92vh!important;
    }
  }
</style>
